<template>
	<view>
		<view class="formlist inputtext" v-if="jnpfKey == 'checkbox'" >
			<view class="formgroup border-bottom-E3E3E5" @tap="staticSelectClick">
				<view class="labletitle">
					<label>{{label}}</label>
					<text class="required" v-show="required">*</text>
				</view>
				<view class="controlvalue">
					<input type="text" v-model="valueTitle" :name="vModel" :placeholder="placeholder"
					 disabled="true">
				</view>
				<view class="advanceicon iconfont icon-xiangyou"></view>
			</view>
		</view>
		<view class="formlist inputtext" v-if="jnpfKey == 'radio'">
			<view class="formgroup border-bottom-E3E3E5" @tap="staticSelectClick">
				<view class="labletitle">
					<label>{{label}}</label>
					<text class="required" v-show="required">*</text>
				</view>
				<view class="controlvalue">
					<input type="text" v-model="valueTitle" :name="vModel" :placeholder="placeholder"
					 disabled="true">
				</view>
				<view class="advanceicon iconfont icon-xiangyou"></view>
			</view>
		</view>
		<view class="formlist inputtext" v-if="jnpfKey == 'select'">
			<view class="formgroup border-bottom-E3E3E5" @tap="staticSelectClick">
				<view class="labletitle">
					<label>{{label}}</label>
					<text class="required" v-show="required">*</text>
				</view>
				<view class="controlvalue">
					<input type="text" v-model="valueTitle" :name="vModel" :placeholder="placeholder"
					 disabled="true">
				</view>
				<view class="advanceicon iconfont icon-xiangyou"></view>
			</view>
		</view>
		<w-picker :mode="mode" :pickerList="pickerList" ref="picker" :isSearchShow="isSearchShow" :wPickerProps='propsAll'></w-picker>
	</view>
</template>

<script>
	import wPicker from '@/components/w-picker/w-picker.vue'
	import config from '@/common/js/config.js'
	export default {
		props: {
			value: '',
			formOperates:{
				type: Array,
				default(){
					return []
				}
			},
			jnpfKey: {
				type: String,
				default () {
					return ''
				}
			},
			placeholder: {
				type: String,
				default () {
					return '请选择'
				}
			},
			dataType: {
				type: String,
				default () {
					return ''
				}
			},
			vModel: {
				type: String,
				default () {
					return ''
				}
			},
			label: {
				type: String,
				default () {
					return ''
				}
			},
			propsLabel: {
				type: String,
				default () {
					return ''
				}
			},
			propsValue: {
				type: String,
				default () {
					return ''
				}
			},
			propsUrl: {
				type: String,
				default () {
					return ''
				}
			},
			dictionaryType: {
				type: String,
				default () {
					return ''
				}
			},
			options: {
				type: Array,
				default () {
					return [{
						fullName: '默认一',
						id: '1'
					}, {
						fullName: '默认二',
						id: '2'
					}]
				}
			},
			disabled: {
				type: Boolean,
				default () {
					return false
				}
			},
			required: {
				type: Boolean,
				default () {
					return false
				}
			},
			showLabel: {
				type: Boolean,
				default () {
					return true
				}
			},
			isId: {
				type: Boolean,
				default () {
					return false
				}
			},
			propsAll: {
				type: Object,
				default () {
					return {
						label: "label",
						value: "value"
					}
				}
			}
		},
		data() {
			return {
				mode: '',
				pickerList: [],
				isSearchShow: false,
				dataList: [],
				valueTitle: this.value,
				option: [],
				Disabled: undefined,
				request: {
					apiKey: '',
					baseUrlObj: '',
					baseUrl: '',
					token: ''
				},
				dynamicList: [],
				dynamicModel: {},
				prop: {},
			};
		},
		created() {
			this.handel(this.value)
		},
		watch: {
			value(val) {
				
				this.handel(val)
			}
		},

		methods: {

			handel(val) {
				const vModel = this.vModel;
				let label;
				
				if (this.options != undefined) {
					if (this.jnpfKey == "checkbox") {
						if (val) {
							let checkValue = val;
							let check = [];
							let _list = [];
							for (let j = 0; j < this.options.length; j++) {
								this.options[j].checked = false;
								for (let k = 0; k < checkValue.length; k++) {
									if (this.options[j][this.propsAll.value] == checkValue[k]) {
										this.options[j].checked = true;
										check[k] = this.options[j][this.propsAll.label];
										_list[k] = this.options[j][this.propsAll.value];
									}
								}
							}
							this.valueTitle = check.toString()
						}
					} else {
						for (let i = 0; i < this.options.length; i++) {
							this.options[i].checked = false;
							if (this.options[i][this.propsAll.value] == val) {
								this.options[i].checked = true;
								
							}
						}
						this.pickerList = this.options;
						label = this.$helper.getSpinner(this.options, val);;
						this.valueTitle = label;
					}
				}
			},



			staticSelectClick() {
				if(this.disabled)return
				const jnpfKey = this.jnpfKey;
				const vModel = this.vModel;
				this.Disabled = true;
				// 临时处理数据类型不匹配的警告提示
				let newOption = []
				let key = this.propsAll.label;
				let id = this.propsAll.value
				for(let i = 0;i<this.options.length;i++){
					newOption.push({
						[key] : this.options[i][key],
						[id] : this.options[i][id].toString(),
						checked : this.options[i].checked
					})
				}
				
				this.option = newOption
				switch (jnpfKey) {
					case 'radio':
						this.mode = 'electionsingle';
						this.pickerList = this.option

						break;
					case 'checkbox':
						this.mode = 'multiselector';
						this.pickerList = this.option
						break;
					case 'select':
						this.mode = 'selector';
						this.pickerList = this.option

						break;
				}
				/* 显示底部弹窗控件 */
				this.$refs.picker.show();

				/* 清除子组件事件 */
				this.$eventHub.$off('popupmodality');

				/* 添加事件 */
				this.$eventHub.$on('popupmodality', (data) => {
					if(jnpfKey != 'checkbox'){
						
						let _value;
						if(this.option != undefined){
							_value = this.$helper.setSpinner(this.option,data.result);/* 转id */
						}
						this.valueTitle = data.result
						
						this.$emit('input',_value)
						this.option = this.pickerList;
						return;
					}

					let _list = [];
					let _label = [];
					let num = 0;
					for (let i = 0; i < this.pickerList.length; i++) {
						if (this.pickerList[i].checked == true) {
							
							_list[num] = this.pickerList[i][this.propsAll.value];
							_label[num] = this.pickerList[i][this.propsAll.label];
							
							num = num + 1;
						}
					}
					
					let label = _label.toString();
					
					this.valueTitle = label;
					this.$emit('input', _list);
					// this.option = this.pickerList;
					/* 清除子组件事件 */
					this.$eventHub.$off('popupmodality');
				});
			}
		}
	}
</script>

<style>
	.required {
		color: red;
	}
</style>
